<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>元素溢出</title>
<style>
    .box{
        border:5px solid #00f;
        /*.必须限制所在区域的大小才会出现溢出,否则内容会把高度撑起来*/
        width: 700px;
        height: 1000px;
        overflow: visible;/*visible默认值，内容溢出盒子外部*/
        overflow: hidden;/*溢出隐藏,超出去的部分直接裁掉*/
        overflow: scroll;/*滚动条，两个方向都显示*/
        overflow: auto;/*自动在溢出的方向显示滚动条*/
    }
    /*在垂直方向上,朝图片的. ..对齐*/
    img {
        width: 200px;
        vertical-align: baseline;/*默认值，基线对齐*/
        vertical-align: bottom;/*底部对齐*/
        vertical-align: center;/*中间对齐*/
        vertical-align: top;/*顶部对齐*/

    }
</style>
</head>
<body>
abyjT<img src="1.png">国圈<img src="1.png">
    <div class="box">
        <img src="1.png" alt="">
        <img src="1.png" alt="">
        <img src="1.png" alt="">
        <img src="1.png" alt="">
        <img src="1.png" alt="">
    </div>
</body>
</html>